<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Brand</title>

    <!-- Bootstrap -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div>
    <h1>Brand</h1>
    <form>
        <input type="text" name="name">
        <input type="button" class="btn btn-success" value="Search" onclick="doQueryBrands()">
        <input type="button" class="btn btn-success" value="Add" onclick="doAdd()">
    </form>
    <table>
        <thead>
        <tr>
            <th>id</th>
            <th>name</th>
            <th>remark</th>
            <th>createdTime</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="brand: ${list}">
            <td th:text="${brand.id}">10</td>
            <td th:text="${brand.name}">AAA</td>
            <td th:text="${brand.remark}">AAA</td>
<!--            <td th:text="${#dates.format(date, 'dd/MMM/yyyy HH:mm')}">AAA</td>-->
            <td th:text="${brand.createdTime}">AAA</td>

            <!--        <td th:text="${#dates.format(brand.createdTime, 'yyyy/MM/dd-->
            <!--         HH:mm')}">2020/10/11-->
            <!--        </td>-->
            <td>
                <button type="button" class="btn btn-danger" th:onclick="doDeleteByIdBrand('[[${brand.id}]]')">delete
                </button>
                <button type="button" class="btn btn-info" th:onclick="doFindById('[[${brand.id}]]')">update</button>
            </td>
        </tr>
        </tbody>
    </table>
</div>
<script>
    function doQueryBrands() {
        let name = document.forms[0].name.value;
        location.href = `http://localhost:8080/brand/doFindBrands/${name}`;
    }

    function doDeleteByIdBrand(id) {
        location.href = `http://localhost:8080/brand/doDeleteById/${id}`;
    }

    function doFindById(id) {
        location.href = `http://localhost:8080/brand/doFindById/${id}`;
    }

    function doAdd() {
        location.href = `http://localhost:8080/brand/doAddUI`;
    }
</script>
</body>
</html>